<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ include file="/share/_meta.jsp" %>
<%@ include file="/share/_footer.jsp" %>
<style type="text/css">
    .table>tbody>tr>td{
        text-align:center;
    }
</style>
<nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页 <span class="c-gray en">&gt;</span>系统管理中心 <span class="c-gray en">&gt;</span> 直接收费
    <a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新" ><i class="Hui-iconfont">&#xe68f;</i></a>
</nav>
<div class="page-container">
    <form id="myform" method="post">
        <div class="codeView docs-example">
           <input id = "projectid" type="text" placeholder="项目类型" class="input-text radius size-L" style="width:250px" name="projectid">
            开始时间:<input type="text" class="input-text radius size-L" name="startTime" style="width:150px" id="startTime" >
            结束时间:<input type="text" class="input-text radius size-L" name="endTime" style="width:150px" id="endTime" >
            <%--  <div class="form-group">
                <select class="form-control" style="width:250px" name="housingId" id="housingId">
                    <option value=''>所有小区</option>
                    <c:forEach items="${parentList}" var="item">
                        <option value="${item.id}" <c:if test="${query.housingId==item.id }">selected</c:if>>${item.name}</option>
                    </c:forEach>
                </select>
            </div>
            <div class="form-group">
                <select class="form-control shift-info" style="width:250px" name="costType" id = "costType">
                    <option value=''>所有费用类型</option>
                    <c:forEach items="${costList}" var="item">
                        <option value="${item.id}" <c:if test="${query.costType==item.id }">selected</c:if>>${item.name}</option>
                    </c:forEach>
                </select>
            </div>
            <div class="form-group">
                <select class="form-control shift-info" style="width:250px" name="paystatus" id="paystatus">
                    <option value=''>付款状态</option>
                    <option value="0" <c:if test="${query.paystatus == false }">selected</c:if>>未付款</option>
                    <option value="1" <c:if test="${query.paystatus == true }">selected</c:if>>已付款</option>
                </select>
            </div>
            <div class="form-group">
                <select class="form-control shift-info" style="width:250px" name="status" id="status">
                    <option value=''>同步状态</option>
                    <option value="0" <c:if test="${query.status == false }">selected</c:if>>未同步</option>
                    <option value="1" <c:if test="${query.status == true }">selected</c:if>>已同步</option>
                </select>
            </div>
            <br>--%>
            <button type="button" class="btn btn-secondary radius size-L" onclick="query()">查&nbsp;询</button>
            <button type="button" class="btn btn-secondary radius size-L" onclick="directFeeAdd()">添&nbsp;加</button>
        </div>

        <div class="panel panel-default mt-20">
            <div class="panel-header">
                数据列表
            </div>
            <div class="panel-body">
                <table class="table table-border table-bordered table-bg table-hover table-sort table-striped">
                    <thead>
                    <tr class="text-c">
                        <%--<th width="25"><input type="checkbox" name="" value=""></th>--%>
                        <th>项目类型</th>
                        <th>收费类型</th>
                        <th>付款单位</th>
                        <th>电话</th>
                        <th>金额</th>
                        <th>支付类型</th>
                        <th>创建时间</th>
                        <th>小区</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    </tbody>
                </table>
                <br>
                <br>
            </div>
        </div>
    </form>
</div>

<script type="text/javascript" src="${pageContext.request.contextPath}/h-ui/lib/datatables/1.10.0/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/h-ui/common/laydate.js"></script>
<script type="text/javascript">

    $(function(){
        laydate.render({
            elem: '#startTime' //指定元素
            ,format: 'yyyy-MM-dd'
        });
        laydate.render({
            elem: '#endTime' //指定元素
            ,format: 'yyyy-MM-dd'
        });
        queryList();
    })

    function queryList(){
        $(".table-sort").dataTable().fnDestroy();
        $(".table-sort").DataTable({
            bStateSave: false,
            aoColumnDefs: [{bSortable: false}],
            pageLength: 10,
            searching: false,
            bFilter: false,
            bInfo:false,
            bSort:false,
            aLengthMenu:[10],
            serverSide:true,//实现后台分页
            lengthChange: false,
            bPaginate: true,
            ajax: {
                url: "${pageContext.request.contextPath}/rest/directfee/tableDirectFee",
                dataSrc: "data",
                data: function ( d ) {
                    d.projectid = $("#projectid").val();
                    d.startTime = $("#startTime").val();
                    d.endTime = $("#endTime").val();
                }
            },
            aoColumns: [//列绑定
                {"data": "projectid"},
                {"data": "costTypeName"},
                {"data": "feeUnit"},
                {"data": "phone"},
                {"data": "fee"},
                {"data": "payType"},
                {"data": "createTime"},
                {"data": "housName"},
                {"data": "id"}
            ],
            aoColumnDefs: [//列定义
                /*{
                 "aTargets": [0],
                 "mData": "id",
                 "mRender": function (data, type, full) {//全部列值可以通过full.列名获取,一般单个列值用data PS:这里的render是有多少列就执行多少次方法。。。不知道为啥
                 return "";
                 }
                 },{
                    "aTargets": [0],
                    "mData": "id",
                    "mRender": function (data, type, full) {//全部列值可以通过full.列名获取,一般单个列值用data PS:这里的render是有多少列就执行多少次方法。。。不知道为啥
                        return "<input type='checkbox' name='ids' value="+data+">";
                    }
                },*/ {
                    "aTargets": [0],
                    "mData": "projectid",
                    "mRender": function (data, type, full) {//全部列值可以通过full.列名获取,一般单个列值用data PS:这里的render是有多少列就执行多少次方法。。。不知道为啥
                        return data;
                    }
                }, {
                    "aTargets": [1],
                    "mData": "costTypeName",
                    "mRender": function (data, type, full) {//全部列值可以通过full.列名获取,一般单个列值用data PS:这里的render是有多少列就执行多少次方法。。。不知道为啥
                        if(data!=null){
                            return "物业服务费";
                        }
                    }
                }, {
                    "aTargets": [2],
                    "mData": "feeUnit",
                    "mRender": function (data, type, full) {//全部列值可以通过full.列名获取,一般单个列值用data PS:这里的render是有多少列就执行多少次方法。。。不知道为啥
                        return data;
                    }
                }, {
                    "aTargets": [3],
                    "mData": "phone",
                    "mRender": function (data, type, full) {//全部列值可以通过full.列名获取,一般单个列值用data PS:这里的render是有多少列就执行多少次方法。。。不知道为啥
                        return data;
                    }
                }, {
                    "aTargets": [4],
                    "mData": "fee",
                    "mRender": function (data, type, full) {//全部列值可以通过full.列名获取,一般单个列值用data PS:这里的render是有多少列就执行多少次方法。。。不知道为啥
                        return data;
                    }
                }, {
                    "aTargets": [5],
                    "mData": "payType",
                    "mRender": function (data, type, full) {//全部列值可以通过full.列名获取,一般单个列值用data PS:这里的render是有多少列就执行多少次方法。。。不知道为啥
                        if(data==1){
                            return "现金";
                        }else if(data==2){
                            return "支付宝";
                        }else if(data==3){
                            return "微信";
                        }else if(data==4){
                            return "POS机";
                        }else if(data==5){
                            return "银行转帐";
                        }else if(data==6){
                            return "抵用券";
                        }else if(data==99){
                            return "其他";
                        }else {
                            return "";
                        }
                    }
                }, {
                    "aTargets": [6],
                    "mData": "createTime",
                    "mRender": function (data, type, full) {//全部列值可以通过full.列名获取,一般单个列值用data PS:这里的render是有多少列就执行多少次方法。。。不知道为啥
                        return data;
                    }
                }, {
                    "aTargets": [7],
                    "mData": "createTime",
                    "mRender": function (data, type, full) {//全部列值可以通过full.列名获取,一般单个列值用data PS:这里的render是有多少列就执行多少次方法。。。不知道为啥
                        return data;
                    }
                }, {
                    "aTargets": [8],
                    "mData": "id",
                    "mRender": function (data, type, full) {//全部列值可以通过full.列名获取,一般单个列值用data PS:这里的render是有多少列就执行多少次方法。。。不知道为啥
                        var ticketstatus=full.ticketstatus;
                    	var html = "<a title='删除' style='text-decoration:none' onclick='deleteTicket(this,"+data+")' href='javascript:;' class='c-success'>删除</a><br>"
                            +"<a title='打印小票' style='text-decoration:none' onclick='openTicket("+data+")' href='javascript:;' class='c-success'>打印小票</a><br>"                        
                            if(ticketstatus == 0){
                            	html += "<a title='开电子发票' style='text-decoration:none' onclick='approve("+full.id+")' href='javascript:;' class='c-success'>开电子发票</a><br>"
    						}else if(ticketstatus == 1){
    							html += "<a title='退票' style='text-decoration:none' onclick='reject("+full.id+")' href='javascript:;' class='c-success'>退票</a><br>";
    						}else if(ticketstatus == 2){
    							html += "<a title='开电子发票' style='text-decoration:none' onclick='approve("+full.id+")' href='javascript:;' class='c-success'>开电子发票</a><br>"
    						}                                                        
                            return html;
                    }
                }
            ],
            language: {
                aria: {
                    sortAscending: ": activate to sort column ascending",
                    sortDescending: ": activate to sort column descending"
                },
                emptyTable: "没有数据",
                info: "从 _START_ 到 _END_ 共 _TOTAL_ 条",
                infoEmpty: "没有数据",
                infoFiltered: "(0 到 _MAX_ 条)",
                lengthMenu: " _MENU_",
                search: "查询:",
                zeroRecords: "没有数据",
                paginate: {previous: "<", next: ">", last: "最后一页", first: "第一页"}
            }
        })
    }

    function query() {
        queryList();
    }

    function  directFeeAdd(){
        var index = layer.open({
            type: 2,
            title: "新增",
            content: "${pageContext.request.contextPath }/rest/directfee/directFeeAdd"
        });
        layer.full(index);
    }

    function deleteTicket(obj,data){
        layer.confirm('确认要删除吗？',function(index){
            $.ajax({
                type: 'POST',
                url: '${pageContext.request.contextPath }/rest/billAccount/deleteTicket',
                dataType: 'json',
                data:{
                    id : data
                },
                success: function(data){
                    if (data.success) {
                        $(obj).parents("tr").remove();
                        layer.msg('已删除!',{icon:1,time:1000});
                    }else {
                        layer.alert("删除失败");
                    }
                },
                error:function(data) {
                    layer.alert('error!',{icon:1,time:1000});
                },
            });
        });
    }

    function openTicket(data){
        $.ajax({
            type: 'POST',
            url: '${pageContext.request.contextPath }/rest/directfee/printinfo',
            dataType: 'json',
            data:{
                id : data
            },
            success: function(data){
                console.log(data);
                if (data.success) {
                    layer.alert("打印成功");
                }else {
                    layer.alert(data.message);
                }
            },
            error:function(data) {
                layer.alert('error!',{icon:1,time:1000});
            }
        });
    }
    
    function approve(id) {
    	var url="${pageContext.request.contextPath }/rest/page/invoiceBlueByDirectfee.do?id="+id;
    	layer_show('蓝票',url,800,500);
    }
    
    function reject(id) {
    	var url="${pageContext.request.contextPath }/rest/page/invoiceRedByDirectfee.do?id="+id;
    	layer_show('冲红',url,800,500);
    }
</script>

